<template>
    <view class="page-invitation-list page-wallet-preIncome">
        <u-sticky>
			<!-- 只能有一个根元素 -->
			<view class="search-sticky">
				<u-row gutter="0">
					<u-col span="4" v-for="(item,index) in tab.list" :key="index">
						<view class="text-center">
                            <view class="inline-block" :class="tab.current == index ? 'current' : ''" @click="changeTab(index)">
                                <view>{{ item.total }}元</view>
                                <text class="name">{{ item.name }}</text>
                            </view>
                        </view> 
					</u-col>
				</u-row>
			</view>
		</u-sticky>
        <view class="p-4" v-if="tab.list[tab.current].records.length == 0">
            <u-empty text="暂无内容" mode="list"></u-empty>
        </view>
        <view class="list">
			<u-gap height="30"></u-gap>
			<view class="fly-panel" v-for="(item,index) in tab.list[tab.current].records" :key="index">
				<view class="hd"><view class="title">{{ item.relationshipName }}</view></view>
				<view class="bd">
					<view>
						<fly-info label="用户昵称" :value="item.nickname"></fly-info>
						<fly-info label="分成金额" :value="item.ratioAmount + '元'"></fly-info>
						<fly-info label="支付时间" :value="item.payTime"></fly-info>
					</view>					
				</view>
			</view>
		</view>
    </view>
</template>
<script lang="ts" setup>
import FlyInfo from '@/components/FlyInfo';
const {proxy} = getCurrentInstance() as ComponentInternalInstance;
let tab = reactive({
	current: 0,
	list:[
		{id:1, name: '用户推荐预收入', records: [], total: 0},
		{id:2, name: '分会长预收入', records: [], total: 0},
		{id:3, name: '城市会长预收入', records: [], total: 0},
	],
	invitationId: null,
});
const getAmount = async () => {
    let list0 = await proxy.$http('get', '/admin/appuser/user/referrer/amount', {});
    let list1 = await proxy.$http('get', '/admin/appuser/user/branch/amount', {});
    let list2 = await proxy.$http('get', '/admin/appuser/user/city/amount', {});
    tab.list[0].records = list0;
    tab.list[1].records = list1;
    tab.list[2].records = list2;
    let total0 = 0,
        total1 = 0,
        total2 = 0;
    list0.forEach(item => {
        total0 += item.ratioAmount;
    });
    list1.forEach(item => {
        total1 += item.ratioAmount;
    });
    list2.forEach(item => {
        total2 += item.ratioAmount;
    });
    tab.list[0].total = total0;
    tab.list[1].total = total1;
    tab.list[2].total = total2;    
};
const changeTab = (i) => {
	tab.current = i;
}
onShow(() => {
    getAmount();
})
</script>